function Frame(options)
{
    var frameStyles = {
        "metal" : {
            "table"        : "frame",
            "topLeft"      : "frame-metal-top-left",
            "topCenter"    : "frame-metal-top-center",
            "topRight"     : "frame-metal-top-right",
            "middleLeft"   : "frame-metal-middle-left",
            "middleCenter" : "frame-metal-middle-center",
            "middleRight"  : "frame-metal-middle-right",
            "bottomLeft"   : "frame-metal-bottom-left",
            "bottomCenter" : "frame-metal-bottom-center",
            "bottomRight"  : "frame-metal-bottom-Right",
            "container"    : "frame-metal-container"
        },
        "input" : {
            "table"        : "frame",
            "topLeft"      : "frame-input-top-left",
            "topCenter"    : "frame-input-top-center",
            "topRight"     : "frame-input-top-right",
            "middleLeft"   : "frame-input-middle-left",
            "middleCenter" : "frame-input-middle-center",
            "middleRight"  : "frame-input-middle-right",
            "bottomLeft"   : "frame-input-bottom-left",
            "bottomCenter" : "frame-input-bottom-center",
            "bottomRight"  : "frame-input-bottom-Right",
            "container"    : "frame-input-cotainer"
        }
    
    }
    
    var frameStyle = frameStyles.metal;
    
    var self = this;
    
    var width = (options.width != undefined) ? options.width : 300;
    var center = (options.center != undefined) ? options.center : false;
    var padding = (options.padding != undefined) ? options.padding : 10;

    if (options.style != undefined && frameStyles[options.style] != undefined) {
        frameStyle = frameStyles[options.style];
    }
    
    var element = $.create("div");
    var middleCell = $.create("td", {"class":frameStyle.middleCenter}); 
    var container = $.create("div", {"class":frameStyle.container});
    container.css("text-align", (center)?"center":"left");
    container.css("padding", padding);
    
    var table = $.create("table", {"class":frameStyle.table, "style":"width: " + width});
    
    table.append( $.create("tr", {}, [ $.create("td", {"class":frameStyle.topLeft}, $.create("img", {"src": pldkpPaths.site + "spacer.gif"})), 
                                       $.create("td", {"class":frameStyle.topCenter}), 
                                       $.create("td", {"class":frameStyle.topRight}, $.create("img", {"src": pldkpPaths.site + "spacer.gif"}))] ) );
                                       
    table.append( $.create("tr", {}, [ $.create("td", {"class":frameStyle.middleLeft}), 
                                       middleCell.append(container), 
                                       $.create("td", {"class":frameStyle.middleRight})] ) );
                                       
    table.append( $.create("tr", {}, [ $.create("td", {"class":frameStyle.bottomLeft}), 
                                       $.create("td", {"class":frameStyle.bottomCenter}), 
                                       $.create("td", {"class":frameStyle.bottomRight})] ) );

    if (center) {
        element.append($.create("center", {}, table));
    } else {
        element.append(table);
    }
    
    this.clearAndResize = function(width)
    {
        /*
        container.html("");
        
        container.fadeOut("fast", function() {
            table.animate({ "width": "100px" }, "fast", "linear", function() {
                table.animate({ "width": width }, "fast", function() {
                    container.fadeIn("fast");
                });
            });
        });
        */
        
        container.html("");
        table.css("width", width);
        
        
        //table.css("width", width);
    }
    
    this.setBackground = function(imageUrl) 
    {
        middleCell.css('backgroundImage','url(' + imageUrl +')'); 
    }
    
    this.getElement = function()
    {
        return element;
    }
    
    this.getContainer = function() 
    {
        return container;
    }
    
    this.append = function(node)
    {
        $(container).append(node);
        return self;
    }
    
    this.appendTo = function(node)
    {
        $(element).appendTo(node);
        return self;
    }
}